<template>
	<div class="train-teacher-detail maxW">
		<div class="crumbs-link">
			<router-link to="/train/index">培训列表</router-link>
			<strong v-if="created_info.name"><i>></i>{{created_info.name}}培训</strong>
			<strong v-else><i>></i>培训详情</strong>
		</div>

		<div class="train-detail-wp">

			<div class="train-detail-head clear">

				<div class="train-detail-head-cover fl">
					<img v-if="created_info.picture" :src="BASE_URL + created_info.picture">
				</div>

				<div class="train-detail-head-info fr">

					<h3>{{created_info.name}}</h3>

					<ul class="train-detail-head-txt">
						<li class="train-detail-head-ls clear">
							<span>教师</span>
							<div class="train-detail-head-ls-r">
								<em>{{created_info.username}}</em> 
								<em>
									<!-- 市 -->
									<template v-if="created_info.city_name">
										<strong>{{created_info.city_name}}</strong>
										<i>></i>
									</template>
									<!-- 区 -->
									<template v-if="created_info.zone_name != '暂无地区'">
										<strong>{{created_info.zone_name}}</strong>
										<i>></i>
									</template>
									<!-- 街道 -->
									<template v-if="created_info.street_name != '暂无街道'">
										<strong>{{created_info.street_name}}</strong>
										<i>></i>
									</template>
									<!-- 学校 -->
									<strong v-if="created_info.school_name">{{created_info.school_name}}</strong>
								</em>
							</div>
						</li>
						<li class="train-detail-head-ls clear">
							<span>有效期</span>
							<div class="train-detail-head-ls-r">
								<span>{{created_info.start_time}}<i>至</i>{{created_info.end_time}}</span>
							</div>
						</li>
						<li class="train-detail-head-ls clear">
							<span>学习数</span>
							<div class="train-detail-head-ls-r">
								<span>{{created_info.study_user_count}}</span>
							</div>
						</li>
						<li class="train-detail-head-ls clear">
							<span>状态</span>
							<div class="train-detail-head-ls-r">
								<!-- <el-tag>{{created_info.status_string}}</el-tag> -->
								<el-tag v-if="created_info.status_string === '培训中'">培训中</el-tag>
								<el-tag  v-if="created_info.status_string === '已结束'" type="info">已结束</el-tag>
								<el-tag  v-if="created_info.status_string === '未开始'" type="warning">未开始</el-tag>
								<el-tag  v-if="created_info.status_string === '已过期'" type="danger">已过期</el-tag> 
							</div>
						</li>
						<li class="train-detail-head-ls clear">
							<span>参与人</span>
							<div class="train-detail-head-ls-r train-detail-user">
								<div>
									<span v-for="(item, index) of created_info.teacher_list" :key="index">{{item}}</span>
								</div>
								<ul>
									<li  v-for="(item, index) of created_info.teacher_list" :key="index">{{item}}</li>
								</ul>
							</div>
						</li>
						<li class="train-detail-head-ls clear" v-if="0">
							<span>分享至</span>
							<div class="train-detail-head-ls-r">
								<span>260</span>
							</div>
						</li>
					</ul>
					
				</div>	
			</div>

			<div class="train-detail-content">
				<div class="train-detail-content-tap">
					<el-tabs v-model="activeName2" type="card">

						<el-tab-pane label="课程目录" name="1" v-loading="loading">

							<div class="train-detail-content-tap-l" v-for="(item, index) of catalogList" :key="index" >
								<div class="train-detail-content-tap-l-chaptrt clear">
									<span>{{`第${index+1}章`}}</span>
									<div>
										<p>{{item.name}}</p>
									</div>
								</div>

								<div class="train-detail-content-tap-list" v-for="(section, index2) of item.section" :key="index2">
									<div class="train-detail-content-tap-l-section clear">
										<span>{{`第${index2+1}节`}}</span>
										<div>
											<p>{{section.name}}</p>
										</div>
									</div>
									<ul>
										<li class="train-detail-content-tap-l-list clear" v-for="(list, index3) of section.video" :key="index3">
											<span>{{index3+1}}</span>
											<div class="clear">
												<p>{{list.name}}</p>
												<div class="l-list-operation fr">
													<span>{{list.type}}</span>
													<span>{{list.study_score}} 学分</span>
													<span v-if="item.is_fav == 1">已学习 {{list.study_persend}}</span>
													<!-- <span v-if="list.study_persend && partakeUser.user_id && item.is_fav == 1">已学习 {{list.study_persend}}</span> -->
												</div>
												<!-- 参加人员在培训没结束的状态 -->
												<template v-if="item.is_fav == 1 && created_info.status_string == '培训中' ">
													<template v-if="list.type === '试卷'">
														<div class="train-detail-content-tap-l-list-operation" v-if="list.answer_status != 1">
															<router-link :to="{path: '/train/paper', query: {trainid:trainid, train_little_id:list.train_little_id,test_id: list.res_id, name: created_info.name}}">作答</router-link>
															<a :href="download(list.origin, list.res_id)" v-if="created_info.is_download == 1">下载</a>
														</div>
														<div class="train-detail-content-tap-l-list-operation" v-else>
														<!-- 	<router-link  v-if="list.mark_status == 1"
															:to="{path: '/train/test-see', query: {record_id: list.test_record_id, train_little_id: list.train_little_id,user_id: $g.user_id, create_id: list.teacher_id}}">查看</router-link> -->
															<router-link  v-if="list.mark_status == 1"
															:to="{path: '/train/test-see2', query: {user_id: $g.user_id, test_id: list.res_id, train_id: trainid, train_little_id: list.train_little_id,show_flag: 1, name: created_info.name}}">查看</router-link>
															<span v-else>待批阅</span>
															<a :href="download(list.origin, list.res_id)" v-if="created_info.is_download == 1">下载</a>
														</div>
														
													</template>
													<template v-if="list.type  === '视频'">
														<div class="train-detail-content-tap-l-list-operation">
															<a :href="`${BASE_URL}${list.url}/train_id/${trainid}/train_little_id/${list.train_little_id}/train_score/${list.study_score}/is_download/${list.is_download}`" target="_blank" >学习</a>
															<a :href="download(list.origin, list.res_id)" v-if="created_info.is_download == 1">下载</a>
														</div>
													</template>
													<template v-if="list.type  === '文档'">
														<div class="train-detail-content-tap-l-list-operation">
															<a :href="`${BASE_URL}${list.url}/train_id/${trainid}/train_little_id/${list.train_little_id}/is_download/${list.is_download}`" target="_blank" >学习</a>
															<a :href="download(list.origin, list.res_id)" v-if="created_info.is_download == 1">下载</a>
														</div>
													</template>
													<template v-if="list.type  === '图片'">
														<div class="train-detail-content-tap-l-list-operation">
															<a :href="`${BASE_URL}${list.url}/train_id/${trainid}/train_little_id/${list.train_little_id}/is_download/${list.is_download}`" target="_blank" >学习</a>
															<a :href="download(list.origin, list.res_id)" v-if="created_info.is_download == 1">下载</a>
														</div>
													</template>
													<template v-if="list.type  === '压缩文件'">
														<div class="train-detail-content-tap-l-list-operation">
															<a>该文件不支持预览</a>
															<a :href="download(list.origin, list.res_id)" v-if="created_info.is_download == 1">下载</a>
														</div>
													</template>
													<template v-if="list.type  === '应用程序'">
														<div class="train-detail-content-tap-l-list-operation">
															<a>该文件不支持预览</a>
															<a :href="download(list.origin, list.res_id)" v-if="created_info.is_download == 1">下载</a>
														</div>
													</template>
													<template v-if="list.type  === '其他'">
														<div class="train-detail-content-tap-l-list-operation">
															<a :href="`${BASE_URL}${list.url}/train_id/${trainid}/train_little_id/${list.train_little_id}`" target="_blank" >学习</a>
															<a :href="download(list.origin, list.res_id)" v-if="created_info.is_download == 1">下载</a>
														</div>
													</template>
												</template>

												<!-- 参加人员在培训已结束的状态 -->
												<template v-if="item.is_fav == 1 && created_info.status_string == '已结束' ">
													<template v-if="list.type === '试卷'">
														<div class="train-detail-content-tap-l-list-operation" v-if="list.answer_status == 0 || list.answer_status == null">
															<a :href="BASE_URL+list.url" target="_blank" >查看</a>
															<a :href="download(list.origin, list.res_id)" v-if="created_info.is_download == 1">下载</a>
														</div>
														<div class="train-detail-content-tap-l-list-operation" v-else>
															<!-- <router-link  v-if="list.mark_status == 1"
															:to="{path: '/train/test-see', query: {record_id: list.test_record_id, train_little_id: list.train_little_id,user_id: $g.user_id, create_id: list.teacher_id}}">查看</router-link> -->
															<router-link  v-if="list.mark_status == 1"
															:to="{path: '/train/test-see2', query: {user_id: $g.user_id, test_id: list.res_id, train_id: trainid, train_little_id: list.train_little_id,show_flag: 1, name: created_info.name}}">查看</router-link>

															
															<span v-else>待批阅</span>
															<a :href="download(list.origin, list.res_id)" v-if="created_info.is_download == 1">下载</a>
														</div>
														
													</template>
													<template v-if="list.type  === '视频'">
														<div class="train-detail-content-tap-l-list-operation">
															<!-- <a :href="`${BASE_URL}${list.url}/train_id/${trainid}/train_little_id/${list.train_little_id}`" target="_blank" >查看</a> -->
															<a :href="BASE_URL+list.url" target="_blank" >查看</a>
															<a :href="download(list.origin, list.res_id)" v-if="created_info.is_download == 1">下载</a>
														</div>
													</template>
													<template v-if="list.type  === '文档'">
														<div class="train-detail-content-tap-l-list-operation">
															<a :href="`${BASE_URL}${list.url}/train_id/${trainid}/train_little_id/${list.train_little_id}`" target="_blank" >查看</a>
															<a :href="download(list.origin, list.res_id)" v-if="created_info.is_download == 1">下载</a>
														</div>
													</template>
													<template v-if="list.type  === '图片'">
														<div class="train-detail-content-tap-l-list-operation">
															<!-- <a :href="`${BASE_URL}${list.url}/train_id/${trainid}/train_little_id/${list.train_little_id}`" target="_blank" >查看</a> -->
															<a :href="BASE_URL+list.url" target="_blank" >查看</a>
															<a :href="download(list.origin, list.res_id)" v-if="created_info.is_download == 1">下载</a>
														</div>
													</template>
													<template v-if="list.type  === '压缩文件'">
														<div class="train-detail-content-tap-l-list-operation">
															<a>该文件不支持预览</a>
															<a :href="download(list.origin, list.res_id)" v-if="created_info.is_download == 1">下载</a>
														</div>
													</template>
													<template v-if="list.type  === '应用程序'">
														<div class="train-detail-content-tap-l-list-operation">
															<a>该文件不支持预览</a>
															<a :href="download(list.origin, list.res_id)" v-if="created_info.is_download == 1">下载</a>
														</div>
													</template>
													<template v-if="list.type  === '其他'">
														<div class="train-detail-content-tap-l-list-operation">
															<a :href="BASE_URL+list.url" target="_blank" >查看</a>
															<a :href="download(list.origin, list.res_id)" v-if="created_info.is_download == 1">下载</a>
														</div>
													</template>
												</template>

												<!-- 创培训人的状态 -->
												<template v-if="item.is_fav == 0">
													<template v-if="list.type === '试卷'">
														<div class="train-detail-content-tap-l-list-operation">
															<a :href="BASE_URL+list.url" target="_blank" >查看</a>
															<a :href="download(list.origin, list.res_id)" v-if="created_info.is_download == 1">下载</a>
														</div>
													</template>
													<template v-if="list.type  === '视频'">
														<div class="train-detail-content-tap-l-list-operation">
															<a :href="BASE_URL+list.url" target="_blank" >查看</a>
															<a :href="download(list.origin, list.res_id)" v-if="created_info.is_download == 1">下载</a>
														</div>
													</template>
													<template v-if="list.type  === '文档'">
														<div class="train-detail-content-tap-l-list-operation">
															<a :href="BASE_URL+list.url" target="_blank" >查看</a>
															<a :href="download(list.origin, list.res_id)" v-if="created_info.is_download == 1">下载</a>
														</div>
													</template>
													<template v-if="list.type  === '图片'">
														<div class="train-detail-content-tap-l-list-operation">
															<a :href="BASE_URL+list.url" target="_blank" >查看</a>
															<a :href="download(list.origin, list.res_id)" v-if="created_info.is_download == 1">下载</a>
														</div>
													</template>
													<template v-if="list.type  === '压缩文件'">
														<div class="train-detail-content-tap-l-list-operation">
															<a>该文件不支持预览</a>
															<a :href="download(list.origin, list.res_id)" v-if="created_info.is_download == 1">下载</a>
														</div>
													</template>
													<template v-if="list.type  === '应用程序'">
														<div class="train-detail-content-tap-l-list-operation">
															<a>该文件不支持预览</a>
															<a :href="download(list.origin, list.res_id)" v-if="created_info.is_download == 1">下载</a>
														</div>
													</template>
													<template v-if="list.type  === '其他'">
														<div class="train-detail-content-tap-l-list-operation">
															<a :href="BASE_URL+list.url" target="_blank" >查看</a>
															<a :href="download(list.origin, list.res_id)" v-if="created_info.is_download == 1">下载</a>
														</div>
													</template>
												</template>
												
											</div>
										</li>
									</ul>
								</div>
							</div>

							<div class="dependent" v-if="placeholder">
								<i class="ipng image_state01"></i>
								<p>
									还没发现任何相关的内容哦~
								</p>
							</div>

						</el-tab-pane>

						<el-tab-pane label="培训介绍" name="2">
							<div class="train-detail-content-tap-user clear">
								<div class="train-detail-content-tap-user-img fl">
									<img :src="BASE_URL + train_introduce.avatar_path" >
								</div>

								<div class="train-detail-content-tap-user-info">

									<div class="train-detail-content-tap-user-info-h clear">
										<span>{{train_introduce.name}}</span>
										<strong>{{train_introduce.sub_name}}</strong>

										<div class="train-detail-content-tap-user-info-h-op fr" v-if="train_introduce.id !== $g.user_id">
											<span class="ipng but_Collection01_up" @click="get_follow(train_introduce.id )" v-if="train_introduce.is_relation == 0">
												<i>未关注</i>
											</span>
											<span class="ipng but_Collection01_down" @click="get_follow(train_introduce.id )" v-else>
												<i>已关注</i>
											</span>
											<span class="ipng but_chat01_up" @click="parent(train_introduce)">
												<i>发私信</i>
											</span>
										</div>

									</div>

									<div class="train-detail-content-tap-user-info-tag">
										<span>粉丝 {{train_introduce.relation_num}}</span>
										<span>课程 {{train_introduce.video_num}}</span>
										<span>总播放量 {{train_introduce.video_click}}</span>
									</div>

									<div class="train-detail-content-tap-user-info-brief">
										简介:   {{train_introduce.autograph === '' ? '暂无简介' : train_introduce.autograph}}
									</div>
								</div>
							</div>

							<div class="train-detail-content-tap-user-introduce clear">
								<span>专辑介绍：</span>
								<div>{{profile === '' ? ' 暂无专辑介绍' : profile}}</div>
							</div>		
						</el-tab-pane>
					</el-tabs>
				</div>
			</div>
		</div>	
		<chat  ref="child"></chat>
	</div>
</template>

<script>
	import chat from '@/components/common/chat';
	export default{
		components: {chat},
		data(){
			return {
				activeName2: '1',
				catalogList: [],
				title: '',
				trainid: this.$route.query.trainid,
				created_info: {},
				train_introduce: {},
				profile: '',
				placeholder: false,
				loading: true,
				partakeUser: {},
				isScore: 0,
				redirect_params: sessionStorage.getItem( 'redirect_params' )
			}
		},
		mounted() {
		  	this.$nextTick(function () {
		    	// 代码保证 this.$el 在 document 中
		    	this.get_createdUser()
		    	this.get_catalogList()
		    	this.get_partake()
		  	})
		},
		created(){
			// console.info(this.redirect_params,123)
		},
		watch: {
			'activeName2'(a,b){
				if (a === '2') {
					this.get_introduce()
				}
			}
		},
		methods: {
			parent(obj){
				if (obj.id == this.$g.user_id) {
					this.$message.warning('不能跟自己通讯哦~')
					return
				}
				this.$refs.child.getUserChatOne(obj)
			},
			// chatPath(){
			// 	window.open(this.BASE_URL +':8081' + this.redirect_params+'/personal/contact/privateLette')
			// },
			remind(){
				this.$message({
					message: '培训时间还没开始，暂无法查看',
					type: 'warning'
				});
			},
			//判断该用户是否参加了培训
			get_partake(){
				let success = (res =>{
					let data = res.data;
					this.partakeUser = data
					
				});

				this.$ajax({
					url: 'api/train/check_train_user',
					method: 'get',
					params: {
						train_id: this.trainid,
						user_id: this.$g.user_id
					},
					func: {success: success}
				});
			},
			//培训信息
			get_createdUser(){
				let success = (res =>{
					let data = res.data;
					this.created_info = data;

					if (this.created_info.status_string === '未开始') {
						this.$message({
							message: '培训时间还没开始，暂无法查看',
							type: 'warning'
						});
						this.$router.push('/train/index')
						return
					}
					this.profile = this.created_info.profile

					for(let item in  this.created_info){
						if (this.created_info.hasOwnProperty(item)) {
							if (item === 'start_time') {
								this.created_info.start_time = this.created_info[item].substring(0,16)
							}else if (item === 'end_time') {
								this.created_info.end_time = this.created_info[item].substring(0,16)
							}
						}
					}

				});

				this.$ajax({
					url: '/api/train/train',
					method: 'get',
					params: {
						train_id: this.trainid
					},
					func: {success: success}
				})
			},
			//培训列表
			get_catalogList(){
				let success = (res =>{
					let data = res.data;
					this.catalogList = data;

					this.loading = false

					this.catalogList.length === 0
					? this.placeholder = true
					: this.placeholder = false
				
				});

				this.$ajax({
					url: 'api/train/gettrains_l',
					method: 'get',
					params: {
						userid: this.$store.getters.userInfo.id,
						train_id: this.trainid,
					},
					func: {success: success}
				})
			},
			//培训介绍
			get_introduce(){
				let success = (res =>{
					let data = res.data;
					this.train_introduce = data[0];
				});

				this.$ajax({
					url: 'api/user/user',
					method: 'get',
					params: {
						userid: this.$g.user_id,
						id: this.created_info.create_id,
						is_diffplat: 1
					},
					func: {success: success}
				})
			},
			get_follow(id){
				let success = ( res =>{
					this.$message.success(res.msg);
					this.get_introduce()
				});

				this.$ajax({
					url: 'api/user/bind_relation',
					method: 'post',
					params: {
						user_id: this.$g.user_id,
						follow_id: id,
						type: 0
					},
					func: {
						success: success
					}
				})
			},
			goback(){
				this.$router.back(-1)
			},
			download(type,trainid){
				switch(type){
					case 0: 
						return `${this.BASE_URL}/index/openclass/videodownload?id=${trainid}&answer=separate`;
						break;
					case 1: 
						return `${this.BASE_URL}/index/test/download_test?id=${trainid}&answer=only_test`;
						break;
					case 2: 
						return `${this.BASE_URL}/index/resource/resourcedownload?id=${trainid}&answer=separate`;
						break;
				}
			}
		}
	}
</script>